<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no" />
    <title>首页</title>
    <link rel="stylesheet" type="text/css" href="../c/aui.css" />
    <style media="screen">
        .sx-city {
            color: #fff;
            opacity: 0.5;
            font-size: 0.75rem;
            padding: 0.75rem;
        }

        .sx-city .l {
            background: url('../i/city.png') no-repeat left center;
            background-size: 0.85rem;
            padding-left: 1rem;
            vertical-align: middle;
        }

        .sx-city b {
            font-weight: normal;
        }

        .sx-city .r {
            background: url('../i/right-bai.png') no-repeat right center;
            background-size: 0.5rem;
            padding-right: 0.7rem;
            vertical-align: middle;
        }

        .sx-tc-list {
            background: none !important;
            border: !important;
            padding: 0.1rem;
        }

        .sx-tc-list .aui-col-xs-6 {
            text-align: left;
            margin-bottom: 1rem;
            padding: 0.2rem;
        }

        .sx-tc-list .sx-tags {
            overflow: hidden;
            padding: 0.2rem 0;
        }

        .sx-tc-list .sx-tags span {
            background: #393B44 !important;
            padding: 0.1rem 0.4rem;
            display: inline-block;
            border-radius: 0.15rem;
            margin-right: 0.2rem;
            font-size: 0.65rem;
            opacity: 0.7;
            color: #fff;
        }

        .sx-tc-list .aui-ellipsis-2 {
            font-size: 0.75rem;
            opacity: 0.7;
            line-height: 1.2rem;
            padding: 0.2rem 0.4rem;
            -webkit-line-clamp: 2;
            height: 2.5rem;
        }
        .sx-tc-list .username{
          position: absolute;
          left: 0rem;
          bottom: 0;
          width: 100%;
          background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
          background-image: -o-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
          background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
          padding: 0.5rem;
        }
        .sx-tc-list .username img{
            border-radius: 50%;
            width: 1.5rem;
            height: 1.5rem;
            display: inline-block;
            vertical-align: middle;
        }
        .sx-tc-list .username span{
          color: #fff;
          font-size: 0.65rem;
        }
        .sx-tc-list .img{
          position: relative;
        }
        .sx-tc-list .userimg{
            width: 100%;
            height: 14rem;
            margin-bottom: 0.35rem;
        }
        #city{
          width: 10rem;
          margin: 0 auto;text-align: center;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);-webkit-transform: translate(-50%,-50%);
        }
        #city p{
          color: #fff;
          font-size: 0.75rem;
          opacity: 0.7;
          padding-bottom: 1rem;
        }
        #city .t{
          display: inline-block;
          border-radius: 0.25rem;
          background: #f00;
          color: #fff;
          font-size: 0.75rem;
          padding: 0.25rem 0.75rem;
          margin: 0.75rem 0;
        }
        #city .b{
          font-size: 0.65rem;
          opacity: 0.7;
          padding-top: 1rem;
        }
        .redian{
          margin: 0.75rem;
          margin-bottom: 0;
        }
        .redian .h2{
          font-size: 0.75rem;
          background: url('../i/redian-1.png') no-repeat 0 center;
          background-size: 0.75rem;
          padding-left: 1rem;
        }
        .redian .aui-row{
          padding-top: 0.3rem;
        }
        .redian .aui-row .aui-col-xs-4{
          padding: 0.2rem;
        }
        .redian .aui-row .aui-col-xs-4 img{
          position: relative;
          opacity: 0.4;
          width: 100%;
          height: 100%;
          border-radius: 0.3rem;
        }
        .redian .aui-row .aui-col-xs-4 div{
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          width: 100%;
          height: 100%;
          position:absolute;
          display: flex;
          justify-content: center;
          align-items: center;
          font-size: 0.65rem;
        }
        .so{
          background: rgba(255, 255, 255, 0.07);
          border:1px solid rgba(255, 255, 255, 0.01);
          margin: 0.75rem;
          padding:0.35rem 0.75rem;
          border-radius: 0.25rem;
          color: #999;
          font-size: 0.75rem;
          display: flex;
          justify-content: flex-start;
          align-items: center;
        }
        .so span{
          padding-left: 0.5rem;
        }
        .so img{
          width: 1rem;
        }
    </style>
</head>

<body>
    <div id="header"></div>
    <div id="ad"></div>
    <!-- <div class="so"><img src="../i/sou.png"><span>搜索商家</span></div> -->
    <div class="redian">
      <div class="h2">大神榜</div>
      <div class="aui-row">
          <div class="aui-col-xs-4" tapmode onclick="_url({url:'redian_dashen',index:0,title:'关注大神榜'})">
              <img src="../i/gzds.png" />
              <div>关注大神</div>
          </div>
          <div class="aui-col-xs-4" tapmode onclick="_url({url:'redian_dashen',index:1,title:'粉丝大神榜'})">
              <img src="../i/fsds.png" />
              <div>粉丝大神</div>
          </div>
          <div class="aui-col-xs-4" tapmode onclick="_url({url:'redian_dashen',index:2,title:'作品大神榜'})">
              <img src="../i/zpds.png" />
              <div>作品大神</div>
          </div>
      </div>
    </div>
    <div class="redian">
      <div class="h2" style="background: url('../i/redian-2.png') no-repeat 0 center;background-size: 0.75rem;">视频榜</div>
      <div class="aui-row">
          <div class="aui-col-xs-4" tapmode onclick="_url({url:'redian_zuiduo',index:0,title:'观看最多'})">
              <img src="../i/gkzd.png" />
              <div>观看最多</div>
          </div>
          <div class="aui-col-xs-4" tapmode onclick="_url({url:'redian_zuiduo',index:1,title:'评论最多'})">
              <img src="../i/plzd.png" />
              <div>评论最多</div>
          </div>
          <div class="aui-col-xs-4" tapmode onclick="_url({url:'redian_zuiduo',index:2,title:'点赞最多'})">
              <img src="../i/dzzd.png" />
              <div>点赞最多</div>
          </div>
      </div>
    </div>
    <div class="sx-city aui-card-list-footer"  tapmode onclick="_url({url:'city',title:'城市',bounces:true})">
        <span class="l">当前位置：<b>正在获取定位</b></span>
        <span class="r">切换</span>
    </div>
    <script id="sx-list" type="text/x-dot-template">
      <div class="aui-row">
				{{ for(var i=0,it=it.data; i < it.length; i++) { }}
        <div class="aui-col-xs-6" tapmode onclick="video_list({{= it[i].id}})" id="id{{= it[i].id}}" data-data='{{= JSON.stringify(it[i])}}'>
          <div class="img">
            <img class="userimg" suxiangw-src="{{= _img(it[i].img,winWidth,winHeight,it[i].img?false:true) }}" src="../i/loading_b.png" />
            <div class="username aui-ellipsis-1">
              <img  suxiangw-src="{{= it[i].user.img ? _img(it[i].user.img,60,60) : '../i///qiniu.live.kxg99.com../i/bo/touxiang.png' }}" src='../i/touxiang.png' />
              <span class="aui-ellipsis-1">{{= it[i].user.username}}</span>
            </div>
          </div>
          <div class="aui-ellipsis-2">{{= _text(it[i].content) }}</div>
        </div>
        {{ } }}
      </div>
		</script>
    <section class="sx-tc-list aui-grid" id="sx-view"><div id="loadingdi_huifu"><img src="../i/footer_progress.png" /></div></section>
</body>
<script type="text/javascript" src="../j/api.js"></script>
<script type="text/javascript">
  var city,winWidth,winHeight,aMapLBS;
    apiready = function() {
      namecity();
      api.execScript({
          frameName: 'index_header',
          script: 'header("tongcheng");'
      });
      aMapLBS = api.require('aMapLBS');
			aMapLBS.configManager({
				accuracy: 'hundredMeters',
				filter: 1
			}, function(ret, err) {
				if (ret.status) {
					city_dingwei();
				} else {
					alert('定位初始失败，请联系管理员！');
				}
			});
if(adName){
	_init_ad();
	ad = api.require(adName);
}

      winWidth = Math.ceil(api.winWidth/2);
      winHeight = winWidth+100
    //  console.log('winWidth:'+winWidth+'  winHeight:'+winHeight)

      _list({url:'video/lists',data:{city:city}});
      _shangla(function(ret,err){
      	_list({url:'video/lists',data:{city:city}});
        if(_getPrefs('_config').ad.ad){
					if(_getPrefs('_config').ad.banner == 2  && ad_vip){
						chaping();
					}
				}
      },1)
      if(_getPrefs('_config').ad.ad){
        if(_getPrefs('_config').ad.banner == 2  && ad_vip){
          chaping();
        }
      }
  		// 监听滚动
  		api.addEventListener({
  			name : 'scrolltobottom',
  			extra : {
  				threshold : 100 //设置距离底部多少距离时触发，默认值为0，数字类型
  			}
  		}, function(ret, err) {
  			if (heigutgao == 1) {// heigutgao=1开启执行 0停止执行   防止连续滚动，等加载数据之后在进行滚动。
  				pagenum += 1
  				_list({url:'video/lists',page:pagenum,data:{city:city}});
          if(_getPrefs('_config').ad.ad){
  					if(_getPrefs('_config').ad.chaping == 2  && ad_vip){
  						chaping();
  					}
  				}
  			}
  		});

      // 回到屏幕
  		api.addEventListener({
  			name: 'viewappear'
  		}, function(ret, err) {
        if(_getPrefs('_config').ad.ad){
          if(_getPrefs('_config').ad.banner == 2  && ad_vip){
          //  banner();
          }
        }
  		});
      // 应用从后台回到前台事件
      api.addEventListener({
        name: 'resume'
      }, function(ret, err) {

      });
    }
    // 打开滑动视频
    function video_list(id){
      if(_getPrefs('_config').ad.ad){
        if(_getPrefs('_config').ad.chaping == 2  && ad_vip){
        //  chaping();
        }
      }
      var data = $('#id'+id).data('data');
      _video_list(data);
    }
    function namecity(){
      city = _city();
      if(city){
        $('.sx-city .l b').text(city);
      }else{
        $('.sx-city .l b').text('定位失败');
      }
    }
    function city_dingwei() {
			aMapLBS.singleLocation({
				timeout: 10
			}, function(ret, err) {
				if (ret) {
          console.log(JSON.stringify(ret))
					if (ret.status) {
						_ajax('index/city', function(ret, err) {
              console.log(JSON.stringify(ret))
							if (ret) {
								// 删除原先选择城市
								_removePrefs('city');
								// 定位当前城市
								_setPrefs('_city', ret.ret);
								namecity();
								console.log(JSON.stringify(ret.ret))
							} else {
								console.log(JSON.stringify(err))
							}
						}, {
							latitude: ret.lat,
							longitude: ret.lon
						})
					}
				} else {
					_alert("定位err：" + JSON.stringify(err));
				}
			});
		}
    // 设置高度
    function header(h){
      $('#header').css('height',h+'px');
    }
</script>

</html>
